<div>
    <div ng-if="!vm.hasPermissionStory">
        您无权访问此页面！
    </div>
    <div ng-if="vm.hasPermissionStory">
        <span style="display:inline-block;vertical-align: top;">
            <div ng-click="vm.currentStory = {};vm.mode = 'add';" style="background:{{vm.mode=='add'?'green':'transparent'}}">
                新建
            </div>
            <div ng-repeat="story in vm.stories" ng-click="vm.setCurrentStory(story);vm.mode = 'edit';" style="background:{{vm.currentStory==story?'green':'transparent'}}">
                {{story.title}}
            </div>
        </span>
        <span style="display:inline-block;vertical-align: top;margin-left:5em;">
            <div ng-show="vm.currentStory != undefined" >
                {{vm.currentStory}}<p/>{{vm.mode}}
                <input type="text" ng-model="vm.currentStory.title">
                <textarea ng-model="vm.currentStory.content"></textarea>
                <a class="btn btn-default" ng-click="vm.saveEdit();">保存</a>
                <a ng-show="vm.mode=='edit'" class="btn btn-default" ng-click="vm.remove()">删除</a>
                <p/>
                <span ng-repeat="image in vm.currentStory.images">
                    <img style="width:30%;" ng-src="{{image.url}}" >
                    <a class="btn btn-default" ng-click="vm.removeImage(image);">删除</a>
                </span>
                <div ng-show="vm.mode=='edit'">
                    <ng-include src="'/template/component/UploadFile.html'"></ng-include>
                    <a class="btn btn-default" ng-click="vm.addImages()">添加</a>
                </div>
                <p ng-bind-html="vm.currentStory.content | to_trusted"></p>
            </div>
            <div>
                <div ng-repeat="product in vm.currentStory.products">
                    {{product}}<a ng-click="vm.removeProduct(product)">删除</a>
                </div>
            </div>
        </span>

        <span ng-show="vm.mode=='edit'"style="display:inline-block;vertical-align: top;margin-left:5em;">
            <div ng-repeat="product in vm.getValidProducts()">
                {{product.id}}<p/>
                {{product.name}}
                <a ng-click="vm.addProduct(product)">添加</a>
            </div>
        </span>
    </div>
</div>